<template>
  <div class="page-container">
    <van-nav-bar
      title="疗程记录"
      left-text=""
      right-text=""
      left-arrow
      @click-left="onClickLeft"
    />
    <div v-for="(item, index) in list" :key="index" class="content-box">
      <van-row>
        <van-col
          :span="24"
        >第{{ index + 1 }}次 {{ item.date }} {{ item.time_name }}</van-col>
      </van-row>
      <van-row>
        <van-col span="8">疗前左视: {{ item.bef_eye_left }}</van-col>
        <van-col span="8">疗前右视: {{ item.bef_eye_right }}</van-col>
      </van-row>
      <van-row>
        <van-col span="24">疗前备注: {{ item.bef_eye_remark }}</van-col>
      </van-row>
      <van-row>
        <van-col span="8">疗后左视: {{ item.aft_eye_left }}</van-col>
        <van-col span="8">疗后右视: {{ item.aft_eye_right }}</van-col>
      </van-row>
      <van-row>
        <van-col span="24">疗后备注: {{ item.aft_eye_remark }}</van-col>
      </van-row>
    </div>
  </div>
</template>
<script>
import { eyeRecordList } from '@/api/store'
import { Button, Card, Tag, Toast } from 'vant'
export default {
  name: 'Home',
  components: {
    [Button.name]: Button,
    [Card.name]: Card,
    [Tag.name]: Tag,
    [Toast.name]: Toast
  },
  data() {
    return {
      list: []
    }
  },
  created() {
    this.getOrderInfo(this.$route.query.id)
  },
  methods: {
    // 获取订单的养眼记录
    getOrderInfo(id) {
      eyeRecordList({ order_id: id }).then((res) => {
        if (res.error.code === 0) {
          this.list = res.data.list
        }
      })
    },
    // 返回
    onClickLeft() {
      this.$router.go(-1)
    }
  }
}
</script>
<style lang="less" scoped>
.page-container {
  height: 100vh;
  padding-bottom: 60px;
  box-sizing: border-box;
  overflow: auto;
}
.content-box {
  background-color: #ffffff;
  margin-top: 10px;
  font-size: 14px;
  padding: 10px;
}
.van-row {
  padding: 5px 0;
}
</style>
